/**
 * @Title: UserModal.js
 * @Description: UserModal
 * @author: Fanchao
 * @date: 2020/8/2 12:10 上午
 * @version V1.0
 */

import React, { memo } from 'react';
import { connect } from 'umi';
import { Cascader, Form, Input, Modal } from 'antd';

const layout = {
    labelCol: { span: 4 },
    wrapperCol: { span: 20 },
};
const UserModal = memo(({ leaders: { itemData, treeData }, dispatch, title, visible }) => {
    const [form] = Form.useForm();
    form.setFieldsValue({
        realName: itemData.leaderRealName,
        credentialsNo: itemData.credentialsNo,
        loginId: itemData.loginId,
    });
    return (
        <Modal
            title={title}
            visible={visible}
            width="660px"
            onOk={() => {
                form.validateFields().then(values => {
                    if (itemData.leaderUserId) {
                        values.leaderUserId = itemData.leaderUserId;
                        dispatch({
                            type: 'leaders/updateLeaderUserInfo',
                            payload: values,
                            callback: (result) => {
                                if (result) {
                                    form.resetFields();
                                    dispatch({
                                        type: 'leaders/setItemData',
                                        payload: {},
                                    });
                                    dispatch({
                                        type: 'leaders/setModalVisible',
                                        payload: false,
                                    });
                                    dispatch({
                                        type: 'leaders/getDataSource',
                                        payload: {
                                            keyword: '',
                                        },
                                    });
                                }
                            },
                        });
                    } else {
                        values.userRoleType = 'leader';
                        values.leastDepartmentId = values.leastDepartmentId.pop();
                        values.managerDepartmentId = values.managerDepartmentId.pop();
                        dispatch({
                            type: 'leaders/addLeaderUser',
                            payload: values,
                            callback: (result) => {
                                if (result) {
                                    form.resetFields();
                                    dispatch({
                                        type: 'leaders/setItemData',
                                        payload: {},
                                    });
                                    dispatch({
                                        type: 'leaders/setModalVisible',
                                        payload: false,
                                    });
                                    dispatch({
                                        type: 'leaders/getDataSource',
                                        payload: {
                                            keyword: '',
                                        },
                                    });
                                }
                            },
                        });
                    }
                }).catch(info => {
                });
            }}
            onCancel={() => {
                form.resetFields();
                dispatch({
                    type: 'leaders/setItemData',
                    payload: {},
                });
                dispatch({
                    type: 'leaders/setModalVisible',
                    payload: false,
                });
            }}
        >
            <Form
                {...layout}
                layout="horizontal"
                form={form}
                name="basic"
                // 表单默认值，只有初始化以及重置时生效 莫用
                initialValues={{
                    // name: itemData.name
                }}
            >
                <Form.Item
                    label="真实姓名"
                    name="realName"
                    rules={[{ required: true, message: '必填' }]}
                >
                    <Input placeholder="请输入真实姓名"/>
                </Form.Item>
                <Form.Item
                    label="登录账号"
                    name="loginId"
                    rules={[{ required: true, message: '必填' }]}
                >
                    <Input placeholder="请输入登录账号"/>
                </Form.Item>
                {
                    itemData.leaderUserId ? null : (
                        <Form.Item
                            label="登录密码"
                            name="password"
                            rules={[{ required: true, message: '必填' }]}
                        >
                            <Input placeholder="请输入登录密码"/>
                        </Form.Item>
                    )
                }
                <Form.Item
                    label="证件号"
                    name="credentialsNo"
                    // rules={[{ required: true, message: "必填" }]}
                >
                    <Input placeholder="请输入证件号"/>
                </Form.Item>
                <Form.Item
                    label="职务"
                    name="position"
                    rules={[{ required: true, message: '必填' }]}
                >
                    <Input placeholder="请输入职务"/>
                </Form.Item>
                <Form.Item
                    label="职称"
                    name="title"
                    // rules={[{ required: true, message: "必填" }]}
                >
                    <Input placeholder="请输入职称"/>
                </Form.Item>
                {
                    itemData.leaderUserId ? null : (
                        <>
                            <Form.Item
                                label="所属单位"
                                name="leastDepartmentId"
                                rules={[{ required: true, message: '必填' }]}
                            >
                                <Cascader
                                    changeOnSelect
                                    options={treeData}
                                />
                            </Form.Item>
                            <Form.Item
                                label="管理负责单位"
                                name="managerDepartmentId"
                                rules={[{ required: true, message: '必填' }]}
                            >
                                <Cascader
                                    changeOnSelect
                                    options={treeData}
                                />
                            </Form.Item>
                            <Form.Item
                                label="备注"
                                name="comment"
                                rules={[{ required: true, message: '必填' }]}
                            >
                                <Input.TextArea placeholder="请输入备注"/>
                            </Form.Item>
                        </>
                    )
                }
            </Form>
        </Modal>
    );
});

export default connect(({ leaders, dispatch }) => ({
    leaders,
    dispatch,
}))(UserModal);
